@import '@/assets/css/public';
.main2YaBanGraph{
	color:#fff;
	.wrapper{
	  .ctn{
			border: 1px solid #e3e5e4;
			height: 1000px;
			box-sizing: border-box;
			display: flex;
			& > div + div{
				border-left: 1px solid #e3e5e4;
			}
			.ctnLeft{
				flex:4;
				overflow:hidden;
				display: flex;
				flex-direction: column;
				& > div + div{
					border-top: 1px solid #e3e5e4;
				}
				.ctnLeft-top{
					flex:3;
					overflow:hidden;
					display: flex;
					& > div + div{
						border-left: 1px solid #e3e5e4;
					}
					.ctnLeft-topLeft{
						flex:1;
						overflow:hidden;
						display: flex;
						flex-direction: column;
						.top{
							height: 40px;
							display: flex;
							justify-content: center;
							align-items: center;
							border-bottom: 1px solid #e3e5e4;
							& > p{
								font-size: 16px;
							}
						}
						.ctnLeft-topLeftCtn{
							flex:1;
							overflow: hidden;
							display: flex;
							.one{
								flex:1;
								overflow: hidden;
								padding: 10px;
								box-sizing: border-box;
								& > ul{
									flex:1;
									overflow: hidden;
									display: flex;
									flex-direction: column;
									justify-content: space-between;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
							}
							.two{
								flex:1;
								overflow: hidden;
								padding: 10px;
								box-sizing: border-box;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								& > ul:nth-child(1){
									flex:1;
									overflow: hidden;
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
								& > ul:nth-child(2){
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.icon{
											width: 50px;
											height: 40px;
											& > div{
												transform: scale(.7) !important;
												margin-top: -5px;
											}
										}
									}
								}
							}
						}
					}
					.ctnLeft-topRight{
						flex:1;
						overflow:hidden;
						display: flex;
						flex-direction: column;
						.top{
							height: 40px;
							display: flex;
							justify-content: center;
							align-items: center;
							border-bottom: 1px solid #e3e5e4;
							& > p{
								font-size: 16px;
							}
						}
						.ctnLeft-topRightCtn{
							flex:1;
							overflow: hidden;
							display: flex;
							.one{
								flex:1;
								overflow: hidden;
								padding: 10px;
								box-sizing: border-box;
								& > ul{
									flex:1;
									overflow: hidden;
									display: flex;
									flex-direction: column;
									justify-content: space-between;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
							}
							.two{
								flex:1;
								overflow: hidden;
								padding: 10px;
								box-sizing: border-box;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								& > ul:nth-child(1){
									flex:1;
									overflow: hidden;
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
								& > ul:nth-child(2){
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.icon{
											width: 50px;
											height: 40px;
											& > div{
												transform: scale(.7) !important;
												margin-top: -5px;
											}
										}
									}
								}
							}
						}
					}
				}
				.ctnLeft-btm{
					flex:1.2;
					overflow:hidden;
					display: flex;
					& > div + div{
						border-left: 1px solid #e3e5e4;
					}
					.ctnLeft-btm_left{
						flex:1;
						overflow:hidden;
						display: flex;
						& > p{
							border-right: 1px solid #e3e5e4;
							font-size: 18px;
							display: flex;
							justify-content: center;
							align-items: center;
							padding: 0 20px;
							box-sizing: border-box;
						}
						.ctnLeft-btm_leftCtn{
							padding: 10px;
							box-sizing: border-box;
							flex:1;
							overflow: hidden;
							display: flex;
							// justify-content: space-between;
							justify-content: center;
							.ctnLeft-btm_leftCtn_left{
								flex:1;
								overflow: hidden;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								.ctnLeft-btm_leftCtn_leftTop{
									display: flex;
									flex-direction: column;
									.yingyaban{
										width: 100%;
										border: 1px solid #e3e5e4;
										box-sizing: border-box;
										display: flex;
										align-items: center;
										margin-bottom: 5px;
										padding: 0 10px;
										.icon{
											width: 50px;
											height: 40px;
											& > div{
												transform: scale(.7) !important;
												margin-top: -5px;
											}
										}
									}
								}
								.ctnLeft-btm_leftCtn_leftBtm{
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
							}
							.ctnLeft-btm_leftCtn_right{
								flex:1;
								overflow: hidden;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								margin-left: 20px;
								& > li{
									display: flex;
									align-items: center;
									border: 1px solid #e3e5e4;
									padding: 2px 10px;
									box-sizing: border-box;
									.svgBox{
										width: 60px;
										height: 25px;
										margin-left: 5px;
										display: flex;
										align-items: center;
										justify-content: center;
										& > svg{
											width: 100%;
											height: 100%;
										}
									}
									& > p{
										flex:1;
										font-size: 14px;
										overflow: hidden;
									}
								}
							}
						}
					}
					.ctnLeft-btm_Right{
						flex:1;
						overflow:hidden;
						display: flex;
						& > p{
							border-right: 1px solid #e3e5e4;
							font-size: 18px;
							display: flex;
							justify-content: center;
							align-items: center;
							padding: 0 20px;
							box-sizing: border-box;
						}
						.ctnLeft-btm_leftCtn{
							padding: 30px 5px;
							box-sizing: border-box;
							flex:1;
							overflow: hidden;
							display: flex;
							// justify-content: space-between;
							justify-content: center;
							.ctnLeft-btm_leftCtn_left{
								flex:1;
								overflow: hidden;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								.ctnLeft-btm_leftCtn_leftTop{
									display: flex;
									flex-direction: column;
									.yingyaban{
										width: 100%;
										border: 1px solid #e3e5e4;
										box-sizing: border-box;
										display: flex;
										align-items: center;
										margin-bottom: 5px;
										padding: 0 10px;
										.icon{
											width: 50px;
											height: 40px;
											& > div{
												transform: scale(.7) !important;
												margin-top: -5px;
											}
										}
									}
								}
								.ctnLeft-btm_leftCtn_leftBtm{
									display: flex;
									flex-direction: column;
									& > li{
										display: flex;
										align-items: center;
										border: 1px solid #e3e5e4;
										padding: 2px 0;
										box-sizing: border-box;
										margin-top: 5px;
										.svgBox{
											width: 60px;
											height: 25px;
											margin-left: 5px;
											display: flex;
											align-items: center;
											justify-content: center;
											& > svg{
												width: 100%;
												height: 100%;
											}
										}
										& > p{
											flex:1;
											font-size: 14px;
											overflow: hidden;
										}
									}
								}
							}
							.ctnLeft-btm_leftCtn_right{
								flex:1;
								overflow: hidden;
								display: flex;
								flex-direction: column;
								justify-content: space-between;
								margin-left: 20px;
								& > li{
									display: flex;
									align-items: center;
									border: 1px solid #e3e5e4;
									padding: 2px 10px;
									box-sizing: border-box;
									.svgBox{
										width: 60px;
										height: 25px;
										margin-left: 5px;
										display: flex;
										align-items: center;
										justify-content: center;
										& > svg{
											width: 100%;
											height: 100%;
										}
									}
									& > p{
										flex:1;
										font-size: 14px;
										overflow: hidden;
									}
								}
							}
						}
					}
				}
			}
			.ctnRight{
				padding: 10px;
				box-sizing: border-box;
				flex:1;
				overflow:hidden;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				.ctnRight_top{
					// flex:1;
					// overflow: hidden;
					display: flex;
					flex-direction: column;
					& > p{
						height: 30px;
						display: flex;
						justify-content: center;
						align-items: center;
						font-size: 16px;
					}
					.ctnRight_topCtn{
						flex:1;
						overflow: hidden;
						display: flex;
						flex-direction: column;
						.ctnRight_topCtn_YYB{
							display: flex;
							flex-direction: column;
							& > li{
								display: flex;
								align-items: center;
								border: 1px solid #e3e5e4;
								// padding: 2px 0;
								box-sizing: border-box;
								margin-top: 5px;
								.icon{
									width: 50px;
									height: 38px;
									& > div{
										transform: scale(.7) !important;
										margin-top: -5px;
									}
								}
							}
						}
						.ctnRight_topCtn_RYB{
							margin-top: 10px;
							display: flex;
							flex-direction: column;
							justify-content: space-between;
							& > li + li{
								margin-top: 10px;
							}
							& > li{
								display: flex;
								align-items: center;
								border: 1px solid #e3e5e4;
								padding: 2px 10px;
								box-sizing: border-box;
								.svgBox{
									width: 60px;
									height: 25px;
									margin-left: 5px;
									display: flex;
									align-items: center;
									justify-content: center;
									& > svg{
										width: 100%;
										height: 100%;
									}
								}
								& > p{
									flex:1;
									font-size: 14px;
									overflow: hidden;
								}
							}
						}
					}
				}
				.ctnRight_mid{
					display: flex;
					flex-direction: column;
					& > p{
						height: 30px;
						display: flex;
						justify-content: center;
						align-items: center;
						font-size: 16px;
					}
					& > ul{
						display: flex;
						flex-direction: column;
						& > li{
							display: flex;
							align-items: center;
							border: 1px solid #e3e5e4;
							// padding: 2px 0;
							box-sizing: border-box;
							margin-top: 5px;
							.icon{
								width: 50px;
								height: 38px;
								& > div{
									transform: scale(.7) !important;
									margin-top: -5px;
								}
							}
						}
					}
				}
				.ctnRight_btm{
					// flex:1;
					// overflow: hidden;
					display: flex;
					flex-direction: column;
					& > p{
						height: 30px;
						display: flex;
						justify-content: center;
						align-items: center;
						font-size: 16px;
					}
					& > ul{
						display: flex;
						flex-direction: column;
						& > li{
							display: flex;
							align-items: center;
							border: 1px solid #e3e5e4;
							// padding: 2px 0;
							box-sizing: border-box;
							margin-top: 5px;
							.icon{
								width: 50px;
								height: 38px;
								& > div{
									transform: scale(.7) !important;
									margin-top: -5px;
								}
							}
							& > p{
								font-size: 14px;
							}
						}
					}
				}
			}
	  }
	}
}
